document.write("<script type='text/javascript' src='/statics/js/modules/component/categoryTreeComponent.js'></script>");
var htmlCodes = [
    '<div id="calculatePriceApp">',
    '    <el-container style="height: 100%; border: 1px solid #eee">',
    '        <el-aside width="200px" style="border: 1px solid #eee">',
    '            <zy-category-tree :tree-url="treeUrl" @node-click="nodeClick">分类树组件加载中</zy-category-tree>',
    '        </el-aside>',
    '        <el-container>',
    '            <el-header style="text-align: left; font-size: 12px;height: 26px;">',
    '                <el-row :gutter="20">',
    '                    <el-col :span="10">',
    '                        <el-input placeholder="产品名称" size="mini" v-model="query.productName">',
    '                            <template slot="prepend">产品名称:</template>',
    '                        </el-input>',
    '                    </el-col>',
    '                    <el-col :span="5">',
    '                        <el-button type="primary" size="mini" icon="el-icon-search" @click="productSearch()">搜索',
    '                        </el-button>',
    '                    </el-col>',
    '                </el-row>',
    '            </el-header>',
    '            <el-main>',
    '                <template>',
    '                    <el-table',
    '                            :data="goodsData"',
'                                @row-dblclick="dblclick"',
    '                            border',
    '                            size="mini"',
    '                            max-height="300"',
    '                            style="width: 100%">',
    '                        <el-table-column',
    '                                label="操作"',
    '                                width="120">',
    '                            <template slot-scope="scope">',
    '                                <el-button @click="addProduct(scope.row)" type="text" size="small">添加</el-button>',
    '                            </template>',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="productId"',
    '                                label="产品编号"',
    '                                width="120" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="productName"',
    '                                label="产品名称"',
    '                                width="120" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="weight"',
    '                                label="重量"',
    '                                width="120" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="craft"',
    '                                label="规格属性"',
    '                                width="500" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="pricingManner"',
    '                                label="计价方式"',
    '                                :formatter="formatPricingManner"',
    '                                width="100" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="unit"',
    '                                label="单位"',
    '                                width="120" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="price"',
    '                                label="价格"',
    '                                width="120" align="center"',
    '                        >',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="startPrice"',
    '                                label="起步价格"',
    '                                width="120" align="center"',
    '                        >',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                label="阶梯价格" align="center"',
    '                        >',
    '                            <template slot-scope="scope">',
    '                                <el-button @click="seeStepPrice(scope.row)"',
    '                                           v-show="scope.row.stepPrice!=\'[]\'&&scope.row.stepPrice!=null&&scope.row.stepPrice!=\'\'" type="text"',
    '                                           size="small">查看',
    '                                </el-button>',
    '                            </template>',
    '                        </el-table-column>',
    '                    </el-table>',
    '                </template>',
    '                <!--下方table-->',
    '                <div style="padding: 4px"><h4 style="color: #0f6ab4">选中商品详情</h4></div>',
    '                <template>',
    '                    <el-table',
    '                            :data="goodsTableData"',
    '                            border',
    '                            size="mini"',
    '                            max-height="300"',
    '                            style="width: 100%">',
    '                        <el-table-column',
    '                                width="100"',
    '                                label="操作"',
    '                          >',
    '                            <template slot-scope="scope">',
    '                                <el-button @click="deleteProduct(scope.$index,goodsTableData)"   type="text" size="small">删除</el-button>',
    '                            </template>',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="productId"',
    '                                label="产品编号"',
    '                                width="80" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="productName"',
    '                                label="产品名称"',
    '                                width="120" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="weight"',
    '                                label="重量"',
    '                                width="100" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="craft"',
    '                                label="规格属性"',
    '                                width="300" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="pricingManner"',
    '                                label="计价方式"',
    '                                :formatter="formatPricingManner"',
    '                                width="200" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                label="周长或面积"',
    '                                width="200" align="center">',
    '                            <template scope="scope" v-if="scope.row.goodsType==\'material\'">',
    '                                <el-input size="small"   @blur="changeArea(scope.row)" style="width:80px" v-model="scope.row.length" type="number" :min="0.01"></el-input>',
    '                                <span v-show="scope.row.pricingManner==0">* <el-input size="small" type="number" :min="0.01" @blur="changeArea(scope.row)" style="width:80px" v-model="scope.row.width" ></el-input>',
    '                                </span>',
    '                            </template>',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="unit"',
    '                                label="单位"',
    '                                width="120" align="center">',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="price"',
    '                                label="单价"',
    '                                width="120" align="center"',
    '                        >',
    '                        </el-table-column>',
    '                        <!--  <el-table-column',
    '                                  prop="copy"',
    '                                  label="份数"',
    '                                  width="120" align="center">',
    '                          >',
    '                              <template scope="scope">',
    '                                  <el-input size="small" @change="changCopy(scope.row)" v-model="scope.row.copy" ></el-input>',
    '                              </template>',
    '                          </el-table-column>-->',
    '                        <el-table-column',
    '                                prop="quantity"',
    '                                label="数量"',
    '                                width="120" align="center">',
    '                            >',
    '                            <template scope="scope" >',
    '                                <el-input size="small"  type="number" :min="1" @blur="changeQuantity(scope.row)" v-model="scope.row.quantity" ></el-input>',
    '                            </template>',
    '                        </el-table-column>',
    '                        <el-table-column',
    '                                prop="total"',
    '                                label="总价"',
    '                                align="center">',
    '                            >',
    '                            <template scope="scope">',
    '                                <el-input size="small" disabled v-model="scope.row.total" ></el-input>',
    '                            </template>',
    '                        </el-table-column>',
    '                    </el-table>',
    '                </template>',
    '            </el-main>',
    '            <el-footer>',
    '                <el-row>',
    '                    <el-col :span="5" :offset="10">',
    '                        <el-button   type="primary" size="small" @click="addToMainTable">添加</el-button>',
    '                        <el-button   size="small" @click="cancelAdd">取消</el-button>',
    '                    </el-col>',
    '                </el-row>',
    '            </el-footer>',
    '        </el-container>',
    '    </el-container>',
    '    <!--阶梯价格-->',
    '    <el-dialog title="阶梯价格" :visible.sync="visible.stepPriceDialogVisible" width="30%"  append-to-body>',
    '        <el-table :data="stepPriceData">',
    '            <el-table-column property="minSum" label="起始数量" width="150" align="center"></el-table-column>',
    '            <el-table-column property="maxSum" label="结束数量" width="200" align="center"></el-table-column>',
    '            <el-table-column property="price" label="价格" align="center"></el-table-column>',
    '        </el-table>',
    '    </el-dialog>',
    '</div>'
].join("");
Vue.component('zy-calculate-stand-price', {
    template:htmlCodes,
    props: {
        fast: {},
        print: {},
    },
    data() {
        return {
            query: {
                productName: null,
            },
            visible: {
                stepPriceDialogVisible: false,
            },
            treeUrl: 'order/erporder/treeData',//引入树组件url
            treeData: null,
            goodsData: [],//商品
            goodsTableData: [],// 选择商品
            stepPriceData: [], // 阶梯价格
            detailData: [],// 提交数据
            memberId:99999999,
        }
    },
    methods: {
        //获取会员id
        getStandardMemberId:function(memberId){
            if(!isBlank(memberId)){
                this.memberId=memberId;
            }
            this.goodsData=[];
            this.goodsTableData=[];
        },
        //分类树点击事件
        nodeClick: function (data) {
            var categoryId = data.categoryId;
            var self = this;
            $.get(baseURL + "order/erporder/productInfo/" + categoryId+"/"+self.memberId, function (r) {
                if (r.code == 0) {
                    self.goodsData = r.goodsData;
                } else {
                    alert(r.msg);
                }
            });
        },
        //产品搜索
        productSearch: function () {
            var self = this;
            $.ajax({
                type: "POST",
                url: baseURL + "order/erporder/productSearch",
                contentType: "application/x-www-form-urlencoded",
                dataType: "json",
                data:{ "productName":self.query.productName,"memberId":self.memberId},
                success: function (r) {
                    if (r.code == 0) {
                        self.goodsData = r.goodsData
                    } else {
                        alert(r.msg);
                    }
                }
            });
        },
        dblclick:function(row){
            this.addProduct(row);
        },

        //添加商品到添加商品弹出框下方table中
        addProduct: function (row) {
            if (row.price == null && row.stepPrice == '[]') {
                alert("请先维护价格！");
                return;
            }
            for (var i=0;i<this.goodsTableData.length;i++){
                if(this.goodsTableData[i].productId==row.productId&&this.goodsTableData[i].goodsType!='material'){
                    alert("已存在相同商品,请直接修改数量!");
                    return;
                }
            }
            if (row.goodsType == "standard" || row.goodsType == "design") {
                //深克隆
                var item = JSON.parse(JSON.stringify(row));
                item.copy = 1;
                item.quantity = 1;
                item.total = item.price * item.copy * item.quantity.toFixed(2);
                // item.goodsType='standard';
                // todo 去重
                this.goodsTableData.push(item);
            }
            //如果为广告物料以及按周长计算
            if (row.goodsType == "material" && row.pricingManner!=0) {
                //深克隆
                var item = JSON.parse(JSON.stringify(row));
                item.length = 1;
                item.quantity = 1;
                item.total = item.price;
                item.goodsType = 'material';
                this.goodsTableData.push(item);
            }
            //如果为广告物料以及按面积计算
            if (row.goodsType == "material" && row.pricingManner == 0) {
                //深克隆
                var item = JSON.parse(JSON.stringify(row));
                item.width = 1;
                item.length = 1;
                item.quantity = 1;
                item.total = item.price;
                item.goodsType = 'material';
                this.goodsTableData.push(item);
            }
        },

        //删除选中的商品
        deleteProduct: function (index, goodsTableData) {
            this.goodsTableData.splice(index, 1);
        },

        //查看阶梯价
        seeStepPrice: function (row) {
            this.stepPriceData = JSON.parse(row.stepPrice);
            this.visible.stepPriceDialogVisible = true;
        },

        //监控数量变化
        changeQuantity:function (row) {
            //先根据分数和数量查出价格再计算
            var price= this.getPrice(row);
            row.price=price;
            //查看是为标品还是广告物料
            if(row.goodsType=="standard"||row.goodsType=="design"){
                row.total=(row.price*row.quantity).toFixed(2);
            }
            if(row.goodsType=='material'){
                if(row.pricingManner==0) {
                    row.total=(row.length*row.width*row.price*row.quantity).toFixed(2);
                }else{
                    row.total=(row.length*row.price*row.quantity).toFixed(2);
                }
            }
        },

        //监控面积变化
        changeArea:function(row){
            //如果为按照面积计算
            if(row.pricingManner==0){
                if(row.length==''||row.width==''||row.length==0||row.width==0){
                    alert("请输入尺寸");
                    if(row.length==''||row.length==0){
                        row.length=1
                    }
                    if(row.width==''||row.width==0){
                        row.width=1
                    }
                }
                row.total=(row.length*row.width*row.price*row.quantity).toFixed(2);
                return;
            }
            if(row.pricingManner==1||row.pricingManner==2){
                if(row.length==''||row.length==0){
                    alert("请输入合适长度");
                    row.length=1
                    return;
                }
                row.total=(row.length*row.price*row.quantity).toFixed(2);
            }

        },

        //根据分数和数量计算价格
        getPrice:function(row){
            var price=row.price;

            //判断是否为广告物料
            var totalCount=0;
            if(row.goodsType=="standard"||row.goodsType=="design"){
                totalCount=row.quantity;
            }else{
                if(row.goodsType=="material"&&row.pricingManner!=0){
                    totalCount=row.length*row.quantity;
                }else{
                    totalCount=row.length*row.width*row.quantity;
                }
            }
            if(!isBlank(row.stepPrice))
            {
                var priceArr=JSON.parse(row.stepPrice);
                for(var i=0;i<priceArr.length;i++){
                    if(parseInt(priceArr[i].minSum)<=totalCount&&parseInt(priceArr[i].maxSum)>=totalCount) {
                        price= priceArr[i].price;
                        break;
                    }
                }
            }

            return price;
        },

        //把添加的商品添加到订单详情table中
        addToMainTable: function () {
            if (this.goodsTableData.length == 0) {
                alert("请至少添加一个商品!");
                return;
            }
            //重新封装数据
            var goodTableData = [];
            //判断是否为广告物料，
            for (let i = 0; i < this.goodsTableData.length; i++) {
                var row = this.goodsTableData[i];
                if (row.goodsType == "standard" || row.goodsType == 'design') {
                    row.showAddon=row.craft;
                    goodTableData.push(row);
                }  else if (row.goodsType == "material") {
                    var item = JSON.parse(JSON.stringify(row));
                    if (row.pricingManner == 1) {
                        item.craft = item.craft + ",周长:" + item.length;
                    } else if (row.pricingManner == 2) {
                        item.craft = item.craft + ",长度:" + item.length;
                    } else {
                        item.craft = item.craft + ",面积:" + item.length + "*" + item.width;
                    }
                    item.showAddon=item.craft;
                    goodTableData.push(item);
                }
            }
            //处理总价小于起步价部分数据
            for (var i=0;i<goodTableData.length;i++){
               var row=goodTableData[i];
               if(row.total<row.startPrice){
                   row.total=row.startPrice;
                   //查看是为标品还是广告物料
                   if(row.goodsType=="standard"||row.goodsType=="design"){
                       row.price=(row.total/row.quantity).toFixed(2);
                   }
                   if(row.goodsType=='material'){
                       if(row.pricingManner==0) {
                           row.price=(row.total/(row.length*row.width*row.quantity)).toFixed(2);
                       }else{
                           row.price =( row.total/(row.length*row.quantity)).toFixed(2);
                       }
                   }
               }
            }
            // 抛出事件
            this.$emit('zy-add-stand-goods', goodTableData);
            this.goodsTableData=[];
            this.goodsData=[];
        },


        formatPricingManner:function(row, column, cellValue){
            if (row.goodsType == "material"&&cellValue == 0) {
                return '按面积计价'
            } else if (row.goodsType == "material"&&cellValue == 1) {
                return '按周长计价'
            }else if(row.goodsType == "material"&&cellValue == 2) {
                return '按长度计价'
            }else{
                return "";
            }
        },

        //取消添加
        cancelAdd:function() {
            //将添加的商品数据清除:
            this.goodsTableData = [];
            this.goodsData = [];
            // 抛出事件
            this.$emit('zy-cancel-stand-goods');
        },
    }
});
